<@master template="/common/master"  title="首页-p2p金融">
	<@css href="/css/p2p/swiper-3.3.1.min.css" rel="stylesheet"/>
    <div class="banner swiper-container">
    	<div class="swiper-wrapper">
    		<#list banners as banner>
    			<#if banner.isDisplay = 1>
	    			<#if banner.isLinkEnabled == 0>
	    				<div class="swiper-slide">
	    					<a href="http://${banner.url}" target=<#if banner.target == 1>"_self"<#else>"_blank"</#if>><@img src="${banner.imageUrl}"/></a>
	    				</div>
	    			<#else>
	    				<div class="swiper-slide"><@img src="${banner.imageUrl}"/></div>
	    			</#if>
	    			<#else>
	    				<div class="swiper-slide"><@img src="/images/p2p/bar2.jpg"/></div>
	    				<div class="swiper-slide"><@img src="/images/p2p/bar2.jpg"/></div>
	    		</#if>
    		</#list>
        </div>
        <div class="swiper-pagination"></div>
    </div>
    <div class="p2pTitle mt20">
    	<i class="remen mr5"></i>
    	热门项目
    </div>
    <div class="p2pList pb100">
    	<ul>
        	<#list datas as investInfo>
                <a href="/investor/details?id=${investInfo.id}">
	                <li>
		            	<div class="p2pTxt b_b">${investInfo.groupTeam}：${investInfo.title}</div>
		                <div class="clearfix mt20">
		                	<div class="fl listL">
		                    	<div class="red mb10"><i class="fs42">${investInfo.annualizedYield}</i> %</div>
		                        <span class="c999">
		                        	<#if investInfo.refundType == 1>
		                        		一次性本息
		                        	<#elseif investInfo.refundType ==2>
		                        		按月付息到期还款
		                        	<#else>
		                        		未知方式
		                        	</#if>
		                        </span>
		                    </div>
		                    <div class="fl listC c666">
		                    	<p class="mb15"><span class="momeyIco"></span>${investInfo.lowestInvestentAmount}起投 </p>
		                        <p><span class="timeIco"></span>${investInfo.deadline}个月</p>
		                    </div>
		                    <#if investInfo.investedAmount?? || investInfo.loanAmount??>
				        		 <#assign progress="${((investInfo.investedAmount/investInfo.loanAmount)*100)?string('#.##')}"/>        
					        <#else>
				                <#assign progress="0"/>
			                </#if>
		                    <div class="fr listR">
		                    	<div class="indicatorContainer" progress="${progress}"></div>  
		                    </div>
		                </div>
		            </li>
		         </a>
			</#list>
        </ul>
    </div>
    <@js src="http://cdn.o2osit.eascs.com/js/p2p/swiper-3.3.1.min.js"/>
    <@js src="http://cdn.o2osit.eascs.com/js/p2p/radialIndicator.js"/>
	<@js>
		var swiper = new Swiper('.swiper-container', {
	        pagination: '.swiper-pagination',
	        paginationClickable: true,
	        preloadImages:false,
	        loop: true,
	        autoplay : 2000,
			speed:1000,
	    });
	    
	    $(".indicatorContainer").each(function(){
	    	var progress = $(this).attr("progress");
	    	if(progress<1) progress=5;
		     $(this).radialIndicator({
		        barColor:{
					0: '#c0c0c0',
					1: '#09a0e7',
					100: '#09a0e7'
				},
		        barWidth: 5,
		        initValue:progress,
				radius : 30,
				fontWeight:'normal',
		        roundCorner : true,
		        percentage: true
		    });
		 });
	</@js>
	<@jsRender/>
    <@include file="/common/footer"/>
</@master>